/**
 * 人才政策管理 人才政策列表
 */
<template>
    <div>
        <!-- 面包屑导航 -->
        <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>人才政策列表</el-breadcrumb-item>
        </el-breadcrumb>
        <!-- 搜索筛选 -->
        <el-form :inline="true" :model="formInline" class="user-search">
            <el-form-item label="搜索：">
                <el-input
                    size="small"
                    v-model="formInline.title"
                    placeholder="标题"
                ></el-input>
            </el-form-item>
            <el-form-item>
                <el-button
                    size="small"
                    type="primary"
                    icon="el-icon-search"
                    @click="search(formInline.title,pageparm.currentPage,pageparm.pageSize)"
                    >搜索</el-button
                >
            </el-form-item>
        </el-form>
        <!--列表-->
        <el-table
            size="small"
            :data="listData"
            highlight-current-row
            v-loading="loading"
            border
            element-loading-text="拼命加载中"
            style="width: 100%"
        >
            <el-table-column fixed align="center" label="序号" min-width="60">
                <template slot-scope="scope">
                    {{
                        scope.$index +
                        (pageparm.currentPage - 1) * pageparm.pageSize +
                        1
                    }}
                </template>
            </el-table-column>
            <el-table-column
                prop="title"
                align="center"
                label="人才政策标题"
                min-width="120"
                show-overflow-tooltip
            >
            </el-table-column>
            <el-table-column
                prop="content"
                align="center"
                label="人才政策内容"
                min-width="320"
                show-overflow-tooltip
            >
            </el-table-column>

            <el-table-column
                sortable
                prop="createTime"
                align="center"
                label="创建时间"
                min-width="180"
                show-overflow-tooltip
            >
                <template slot-scope="scope">
                    <div>{{ scope.row.createTime }}</div>
                </template>
            </el-table-column>
            <el-table-column
                align="center"
                label="操作"
                width="250"
                fixed="right"
            >
                <template slot-scope="scope">
                    <el-button
                        size="mini"
                        @click="handleEdit(scope.row.uuid, scope.row)"
                        >编辑</el-button
                    >
                    <el-button
                        size="mini"
                        type="danger"
                        @click="deleteUser(scope.row.uuid)"
                        >删除</el-button
                    >
                </template>
            </el-table-column>
        </el-table>
        <!-- 分页组件 -->
        <Pagination
            v-bind:child-msg="pageparm"
            @callFather="callFather"
        ></Pagination>
        <!-- 编辑界面 -->
        <el-dialog
            title="编辑"
            :visible.sync="editFormVisible"
            width="50%"
            @click="closeDialog('editForm')"
        >
            <el-form label-width="120px" :model="editForm" ref="editForm">
                <el-form-item label="公告标题">
                    <el-input
                        v-model="editForm.title"
                        placeholder="请输入标题"
                    ></el-input>
                </el-form-item>
                <el-form-item label="公告内容">
                    <div id="content"></div>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit(editForm.uuid)"
                        >提交</el-button
                    >
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
import requet from "@/api/axios.js";
import Pagination from "../../components/Pagination";
import moment from "moment";
import E from "wangeditor";
export default {
    data() {
        return {
            loading: false, //是显示加载
            editFormVisible: false, //控制编辑页面显示与隐藏
            pageparm: {
                currentPage: 1,
                pageSize: 10,
                total: 30,
            },
            //搜索数据
            formInline: {
                title: "",
                content: "",
            },
            editForm: {}, //编辑数据
            listData: [], //展示数据
            editor: null,
        };
    },
    // 注册组件
    components: {
        Pagination,
    },

    created() {
        this.getdata(this.pageparm.currentPage,this.pageparm.pageSize);
    },
    mounted() {},
    methods: {
        //搜索
        search() {},
        //初始化文本
        initEditr() {
            this.$nextTick(() => {
                const editor = new E("#content");
                editor.create();
                // 配置 onchange 回调函数，将数据同步到 vue 中
                editor.config.onchange = (newHtml) => {
                    this.editForm.content = newHtml;
                };
                this.editor = editor;
            });
        },
        // 获取人才政策列表
        getdata(currentPage,pageSize) {
            this.loading = true;
            requet
                .get(
                    `/hkrc/app/selectTalentPolicyByMap?pageNo=${currentPage}&pageSize=${pageSize}`
                )
                .then((res) => {
                    console.log(res);
                    this.pageparm.total = res.data.count;
                    if (res.data.list.length > 0) {
                        res.data.list.forEach((item) => {
                            // item.createTime = this.newDate(item.createTime)
                            item.createTime = moment(item.createTime).format(
                                "YYYY-MM-DD h:mm:ss"
                            );
                        });
                        this.listData = res.data.list;
                    }
                    this.loading = false;
                });
        },
        // 分页插件事件
        callFather(parm) {
            this.pageparm.currentPage = parm.currentPage;
            this.pageparm.pageSize = parm.pageSize;
            if (this.formInline.title) {
                this.search(this.formInline.title,this.pageparm.currentPage,this.pageparm.pageSize)
            } else {
                this.getdata(this.pageparm.currentPage, this.pageparm.pageSize);
            }
        },
        // // 搜索事件
         search(title,currentPage,pageSize) {
            console.log(title);
            requet
                .post(
                    `/hkrc/app/selectTalentPolicyByMap?title=${title}&pageNo=${currentPage}&pageSize=${pageSize}`
                )
                .then((res) => {
                    console.log(res);
                    this.pageparm.total = res.count;
                    if (res.list.length > 0) {
                        res.list.forEach((item) => {
                            // item.createTime = this.newDate(item.createTime)
                            item.createTime = moment(item.createTime).format(
                                "YYYY-MM-DD h:mm:ss"
                            );
                        });
                        this.listData = res.list;
                    }
                    this.loading = false;
                });
        },
        //显示编辑界面
        handleEdit(uuid, row) {
            this.editFormVisible = true;
            // this.initEditr();
            if (this.editor == null) {
                this.initEditr();
                this.$nextTick(() => {
                    this.editForm = row;
                    this.editor.txt.html(this.editForm.content);
                });
            } else {
                this.$nextTick(() => {
                    this.editForm = row;
                    this.editor.txt.html(this.editForm.content);
                });
            }
        },
        // 编辑保存
        onSubmit(uuid) {
            let data = {
                TalentPolicyInfoJson: {
                    uuid: uuid,
                    title: this.editForm.title,
                    content: this.editForm.content,
                },
            };
            if (this.editForm.title == "" || this.editForm.content == "") {
                this.$message({
                    type: "error",
                    message: "数据不能为空",
                });
            } else {
                requet.post("/hkrc/app/updateTalentPolicy", data).then((res) => {
                    console.log(res);
                    if (res.success) {
                        this.$message({
                            type: "success",
                            message: res.msg,
                        });
                    } else {
                        this.$message({
                            type: "info",
                            message: res.msg,
                        });
                    }
                });
            }
            this.editFormVisible = false;
            this.loading = false;
        },
        // // 删除
        deleteUser(uuid) {
            this.$confirm("确定要删除吗?", "信息", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    requet.del(`/hkrc/app/deleteTalentPolicyById?uuid=${uuid}`).then((res) => {
                    console.log(res);
                    if (res.success) {
                        this.$message({
                            type: "success",
                            message: res.msg,
                        });
                        this.getdata(this.pageparm.currentPage, this.pageparm.pageSize);
                    } else {
                        this.$message({
                            type: "info",
                            message: res.msg,
                        });
                    }
                });
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消删除",
                    });
                });
        },
        // // 关闭编辑、增加弹出框
        // closeDialog(formName) {
        //     this.editFormVisible = false;
        //     this.$refs[formName].resetFields();
        // },
    },
};
</script>

<style scoped>
.user-search {
    margin-top: 20px;
}
.userRole {
    width: 100%;
}
</style>

 
 

 